@import (reference) "_mixins-wln.less";
//@import (inline) "units/_iconfont.less";
@import "units/_reset.less";
@import "units/_layout.less";
@import "units/_btn.less";
@import "units/_resp-base.less";
@import "units/_resp-show.less";

//loading
 #loading-svg{
   position: fixed;
   top:100px;
   left:50%;
   background-color: #fff;
   border-radius:50%;
   padding:6px;
   width:32px;
   height:32px;
   margin-left:-18px;
   box-shadow: 0 1px 25px 2px rgba(0,0,0,.15);
 }
.animated-loading{
  animation-duration:0.2s;
}
//面包屑
.page-crumbs{
  padding:20px 0;
  color:#9fa5ac;
  font-size:14px;
  //border-bottom:1px solid #ddd;
}
.page-nav-tab{
  border-bottom:1px solid #eee;
  a{
    display: inline-block;
    height:70px;
    line-height:70px;
    margin-right:20px;
    box-sizing:border-box;
    padding:0 10px;
    text-align: center;
    font-size:22px;
    &.on{
      color: @primary;
    }
    &:hover{
      color:@primary;
    }
    transition: all 0.3s;
  }
  .router-link-exact-active{
    color: @primary;
    border-bottom:4px solid @primary;
  }
}

//公司业务
.service-page{
  padding-bottom: 80px;
  .sp-content{
    font-size:16px;
    line-height: 1.8;
    text-indent: 2em;
    .sp-img{
      text-indent: 0;
      text-align: center;
      padding:30px 0;
      img{
        max-width:70%;
      }
    }
    h3{
      font-size:22px;
      font-weight:400;
      border-left:4px solid @primary;
      line-height:1.2;
      margin:1.8em 0;
    }
    p{
     margin:0.6em 0;
    }
  }
}

//lazyload
img[lazy]{
transition: opacity 1s;
}
img[lazy=loading] {
  opacity: 0;
}
img[lazy=error] {
  /*your style here*/
}
img[lazy=loaded] {
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .page-nav-tab{
    white-space: nowrap;
    overflow:scroll;
    a{
      height:46px;
      line-height:46px;
      margin-right:4px;
      padding:0 2px;
      font-size:15px;
    }
    .router-link-exact-active{
      border-bottom:2px solid @primary;
    }
  }
  .service-page{
    padding-bottom: 80px;
    .sp-content{
      font-size:14px;
      line-height: 1.4;
      text-indent: 2em;
      .sp-img{
        text-indent: 0;
        text-align: center;
        padding:30px 0;
        img{
          max-width:100%;
        }
      }
      h3{
        font-size:16px;
        font-weight:700;
        line-height:1.2;
        text-indent:0;
        padding-left: 1em;
        margin:3em 0 1em;
      }
      p{
        margin:0.4em 0;
      }
    }
  }
}


//过渡效果
.fadeIn-down-enter-active {
  animation: fadeIn-down .3s linear;
}
.fadeIn-down-leave-active {
  animation: fadeIn-down .3s reverse linear;
}

.fadeIn-up-enter-active {
  animation: fadeIn-up .2s linear;
}
.fadeIn-up-leave-active {
  animation: fadeIn-up .2s reverse linear;
}

//过渡效果-loading
.fadeIn-loading-enter-active {
  animation: fadeIn-loading .15s linear;
}
.fadeIn-loading-leave-active {
  animation: fadeIn-loading .15s reverse linear;
}

.fadeInDown-enter-active {
  animation: fadeInDown .15s linear;
}
.fadeInDown-leave-active {
  animation: fadeInDown .15s reverse linear;
}

@keyframes fadeIn-down {
  0% {
    opacity:0;
    transform: translate(0,-10px);
  }
  100% {
    opacity:1;
    transform: translate(0,0);
  }
}
@keyframes fadeIn-down {
  0% {
    opacity:0;
    transform: translate(0,-10px);
  }
  100% {
    opacity:1;
    transform: translate(0,0);
  }
}@keyframes fadeIn-up {
   0% {
     opacity:0;
     transform: translate(0,5px);
   }
   100% {
     opacity:1;
     transform: translate(0,0);
   }
 }

@keyframes fadeIn-loading {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
